$(function(){


    //调用数据库呈现数据库中所有用户信息
    $.ajax({
        type:'GET',
        url :'editUser',
        data: {'type':1},
        success:function (data){
            console.log(data);
            var innerHTML = '';
            for( var i = 0;i<data.length;i++){
                var status = data[i].isManager?'管理员':'用户';
                innerHTML +='<tr class="user-data">\n' +
                    '           <td>'+data[i].id+'</td>\n' +
                    '           <td>'+data[i].username+'</td>\n' +
                    '           <td>'+data[i].password+'</td>\n' +
                    '           <td>'+data[i].studentId+'</td>\n' +
                    '           <td>'+status+'</td>\n' +
                    '           <td class="btns-action">\n' +
                    '                <button class="action-btn" id="edit-user-btn">编辑</button>\n' +
                    '                <button class="action-btn" id="delete-user-btn">删除</button>\n' +
                    '                <button class="action-btn" id="user-info-btn">详情</button>\n' +
                    '            </td>\n' +
                    '         </tr>';
            }
            $('#user-table').append(innerHTML);
        },
        error:function (errorMsg) {
            console.log(errorMsg);
        }
    })
    var $btn_new = $('#btn-new'),
        $add_user_form = $('#add-user-form'),
        $edit_user_form = $('#edit-user-form'),
        $table = $('table'),
        $status_comboBox = $('#status-comboBox');


    //点击重置按钮显示所有用户
    $(document).delegate('#btn-reset','click',function () {
        var $tr_user_data    = $('tr.user-data');
        //下拉列表选择全部
        $status_comboBox.val('全部');
        $tr_user_data.show();
    })

    //根据身份筛选用户
    $(document).delegate('#status-comboBox','change',function () {
        var $tr_user_data    = $('tr.user-data');
        if($status_comboBox.val() === '用户'){
            console.log('选择用户');
            //筛选显示身份为用户的
            $tr_user_data.hide().filter(":contains('用户')").show();
        }else if($status_comboBox.val() === '管理员'){
            //筛选身份为管理员的
            $tr_user_data.hide().filter(":contains('管理员')").show();
        }else{
            //全显示
            $tr_user_data.show();
        }
    });


    //添加用户
    $btn_new.on('click',function () {
        $btn_new.removeClass('gray');
        $add_user_form.show();
        //TODO:数据库中添加用户



    })
    //关闭添加用户的form表单
    $('#close-add-form-btn').on('click',function (){
        $add_user_form.hide();
        $btn_new.addClass('gray');
    });

    //编辑用户
    $(document).delegate('#edit-user-btn','click',function () {
        $edit_user_form.show();
        $(this).addClass('gray');
        //将选中的用户信息显示在form表单中
        var userId = $(this).closest('tr').find('td:eq(0)').text(),
            username = $(this).closest('tr').find('td:eq(1)').text(),
            password = $(this).closest('tr').find('td:eq(2)').text(),
            studentId = $(this).closest('tr').find('td:eq(3)').text(),
            status = $(this).closest('tr').find('td:eq(4)').text();
        status = (status === '管理员')?1:0;
        console.log(username);

        $('#userId').val(userId);
        $('#username').val(username);
        $('#password').val(password);
        $('#studentId').val(studentId);
        if(status){
            $('#manager-radio').attr('checked',true);
        }else{
            $('#user-radio').attr('checked',true);
        }
    })
    //点击确认修改按钮
    $(document).delegate('#confirm-edit-btn','click',function (){
        var result = confirm('确认提交修改？');
        if(result){
            //TODO:数据库中编辑用户



            confirm('修改成功！');
            $edit_user_form.hide();
            $('.action-btn').removeClass('gray');//把操作中的所有按钮都移除gray的类
        }
    });
    //关闭编辑用户的界面(动态绑定)
    $(document).delegate('#close-edit-form-btn','click',function () {
        $edit_user_form.hide();
        $('.action-btn').removeClass('gray');//把操作中的所有按钮都移除gray的类
    })

    //删除用户
    $table.delegate('#delete-user-btn','click',function () {
        var result = confirm('确认删除用户？');
        if(result){
            $(this).closest('tr').remove();
            //TODO:数据库中删除用户





        }else{
            confirm('删除失败，请重试');
        }
    })

    //输入用户名的自动补全功能



    //输入学号的自动补全功能










})